<template>
    <div class="page">
        <div class="search-view" style="display:none;">
            <Input v-model="search.name" clearable placeholder="请输入车名称" style="width: 150px;margin-right:10px;" />
            <Button 
                class="action-btn"
                icon="ios-search" 
                type="primary" 
                :loading="listData.isLoading"
                @click="onClickSearch">查询
            </Button>
            <Button 
                class="action-btn" 
                type="primary"
                @click="onClickClearSearch">清空
            </Button>
        </div>
        <div class="content-view">
            <NoticeListView 
                :data="listData"
                @on-action="onActionRow">
            </NoticeListView>
        </div>
        <div class="page-view">
            <Page 
                show-elevator
                show-sizer
                show-total
                :current="pageData.currentPage+1" 
                :page-size="pageData.pageSize"
                :total="pageData.totalSize"
                @on-change="changePage"
                @on-page-size-change="changePagesize">
            </Page>
        </div>
        <!-- 操作弹窗 -->
    </div>
</template>

<script>
import NoticeListView from './view/NoticeListView'
import noticeService from '@/network/service/NoticeService.js'

export default {
    components: {
        NoticeListView,
    },
    data() {
        return {
            search: {
                name: null
            },
            pageData: {
                currentPage: 0,
                pageSize: 20,
                totalSize: 0,
            },
            listData: {
                isLoading: false,
                data: []
            },
            editData: {
                isSubmitLoading: false,
                actionType:1, // 1新增，2编辑
                isShow: false,
                data: {

                }
            }
        }
    },
    mounted(){
        this.getDataList();
    },
    methods: {
        onClickSearch() {
            this.getDataList();
        },
        onClickClearSearch() {
            this.search.name = null;
        },
        changePage(page) {
            this.pageData.currentPage = page-1;
            this.getDataList();
        },
        changePagesize(pagesize){
            this.pageData.pageSize=pagesize;
            this.getDataList();
        },
        getDataList() {
            let that = this;
            this.listData.isLoading = true;
            noticeService.getNoticeList(this.pageData.currentPage, this.pageData.pageSize).then(res => {
                that.listData.isLoading = false;
                let result = res.data;
                let code = result.rescode;
                if (code == 100) {
                    that.listData.data=result.data;
                    that.pageData.totalSize = result.totalSize;
                }else {
                    that.$Message.error(result.msg);
                }
            }, error => {
                that.listData.isLoading = false;
                that.$exception.netError(error);
            });
        },
        // 行操作点击
        onActionRow(obj){
            if(obj!=null){
                let action = obj.action;
                let data = obj.data;
                switch(action){
                    case 'edit':
                        break;
                    case 'remove':
                        this.$Modal.confirm({
                            title: '删除公告',
                            content: '<p>您确定要删除该公告吗？</p>',
                            onOk: () => {
                                this.delNotice(data);
                            },
                            onCancel: () => {}
                        });
                        break;
                }
            }
        },
        delNotice(data) {
            let that = this;
            noticeService.delNotice(data.id).then(res => {
                let result = res.data;
                let code = result.rescode;
                if (code == 100) {
                    that.$Message.success('删除成功');
                    that.getDataList();
                }else {
                    that.$Message.error(result.msg);
                }
            }, error => {
                that.$exception.netError(error);
            });
        },
    },
    
}
</script>
<style lang="less" scoped>
.page {
    .search-view {
        margin-bottom: 5px;
        .action-btn {
            margin-right: 10px;
        }
    }
    .content-view {
        
    }
    .page-view {
        text-align: center;
        padding: 5px;
        border-radius: 4px;
        background-color: #fff;
        margin-top: 10px;
    }
}

</style>


